<!--TRANSLATION-->
<template class="tooltip-translation-template">
    <div style="max-height: 3.5rem;" class="draggable tooltip-root hidden-on-touchscreen z-[9999] tooltip absolute font-zen-maru-gothic text-s-mobile px-1.5 py-1 rounded-md">
        <div class="translate-wrapper hidden bg-dark-pop-up bg-opacity-50 backdrop-blur-2xl w-[20rem] min-h-[20rem] p-3 rounded-xl pxy-br transition-all">
            <div class="flex flex-row items-center justify-between">
                <h3 class="text-heading-2-mobile leading-6 tracking-[0.0125rem] font-extra-thick font-alumni">{{ _('Translation on') }}</h3>
                <button class="tooltip-collapse absolute top-2 right-2 opacity-60 hover:opacity-100 transition-opacity"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none" stroke="white"><path d="M15 5L5 15M5 5L15 15" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button>
            </div>
            <text></text>
        </div>
        <div class="w-14 h-14 translate-icon flex justify-center items-center opacity-90 transition-opacity">
            <svg style="opacity:.8" width="25px" height="25px" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="black"><path d="M4.545 6.714 4.11 8H3l1.862-5h1.284L8 8H6.833l-.435-1.286H4.545zm1.634-.736L5.5 3.956h-.049l-.679 2.022H6.18z"/><path d="M0 2a2 2 0 0 1 2-2h7a2 2 0 0 1 2 2v3h3a2 2 0 0 1 2 2v7a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2v-3H2a2 2 0 0 1-2-2V2zm2-1a1 1 0 0 0-1 1v7a1 1 0 0 0 1 1h7a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H2zm7.138 9.995c.193.301.402.583.63.846-.748.575-1.673 1.001-2.768 1.292.178.217.451.635.555.867 1.125-.359 2.08-.844 2.886-1.494.777.665 1.739 1.165 2.93 1.472.133-.254.414-.673.629-.89-1.125-.253-2.057-.694-2.82-1.284.681-.747 1.222-1.651 1.621-2.757H14V8h-3v1.047h.765c-.318.844-.74 1.546-1.272 2.13a6.066 6.066 0 0 1-.415-.492 1.988 1.988 0 0 1-.94.31z"/></svg>
        </div>
    </div>
</template>
<!--TRANSLATION-->